<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://"+ request.getServerName() + ":" + request.getServerPort()+ path + "/";
%>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<base href="<%=basePath%>">
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no"/>
<meta content="telephone=no,email=no" name="format-detection">
<meta name="wap-font-scale" content="no">
<title>会员支付</title>
<!-- 公用样式css -->
<link href="css/base.css" rel="stylesheet" type="text/css" />
<!-- 界面引入css -->
<link href="css/interests-member.css" rel="stylesheet" type="text/css" />
<!-- ui框架引入css -->
<link href="css/weui.min.css" rel="stylesheet" type="text/css" />
<link href="css/jquery-weui.min.css" rel="stylesheet" type="text/css" />
</head>

<body>
<%--	<header class="header">
        <div class="header-left"><img class="img-home" src="images/return.png"/></div>
        <div class="header-center word5 "><a class="header-arrow">订单支付</a></div>
        <a class="header-right wor-colour8 word4" onclick="gotoMember('${sessionScope.memKey}');return false;">我的</a>
         <div class="header-right"><img class="img-home" src="images/icon3.png"/></div>
    </header>--%>
<div class="main bot60" style="background:#eee;">
  <div class="order-time"><p class="wor-colour4 word9" id="time">--:--:--</p><p>支付剩余时间</p></div>
      <ul class="order-detail marg4">
         <li><span class="word6">${hotleName}</span><a class="subscribe-button word3" id="status">预订成功</a></li>
         <li><span class="word5">${roomName}</span> <span class="word5">x${roomNum}间</span><%--这里加房间数--%></li>
         <li class="wor-colour1"><span>${startDate}</span><span>--</span><span>${endDate}</span></li>
      </ul>
  <div class="total word7"><span>总额:</span><span>¥${orderPayment.TotalSettlementShow}</span></div>
<!-- 	  <ul class="defrayal">
          <li class="word4"><span>储值支付</span>
              <span class="myradio float-r">
              <label class="open">
                  <input name="name2" type="radio" value="open" />
              </label>
              <label class="close hidden">
                  <input name="name2" type="radio" value="close" />
              </label>
              </span>
              <span class="wor-colour1 float-r marg3">可用0元</span>
          </li>
          <li class="word4">
              <span>积分兑换</span> <span class="wor-colour5" >100积分=3元</span>
             <span class="myradio float-r">
                  <label class="open hidden">
                      <input name="name" type="radio" value="open" />
                  </label>
                  <label class="close">
                      <input name="name" type="radio" value="close" />
                  </label>
            </span>
              <span class="wor-colour1 float-r wor-height marg3">您有156积分</span>
          </li>
     </ul> -->
  <div class="amount"><span class="lin-h">还需支付:</span><span class="word8 wor-colour6">¥${orderPayment.PayTotal}</span></div>
     <ul class="reply" style="padding-right:20px;">
        <li class="float-l"><img  class="wxzf-img" src="images/icon17.png" /><span class="lin-h1">微信支付</span></li>
        <li class="reply-color float-r">
            <div class="fit_box">
                <input type="radio" value="1" name="check" id="checkbox1" onclick="changePayType(1)" checked>
                <label for="checkbox1"></label>
            </div>
        </li>
    </ul>
     <ul class="reply" style="padding-right:20px;">
        <li class="float-l"><img  class="wxzf-img" src="images/icon40.png" /><span class="lin-h1" >支付宝支付</span></li>
        <li class="reply-color float-r">
            <div class="fit_box">
                <input type="radio" value="2" name="check" id="checkbox2" onclick="changePayType(2)" >
                <label for="checkbox2"></label>
            </div>
        </li>
    </ul>
     <ul class="reply" style="padding-right:20px;">
        <li class="float-l"><img  class="wxzf-img" src="images/icon18.png" /><span class="lin-h1" >余额支付</span></li>
        <li class="reply-color float-r">
            <div class="fit_box">
                <input type="radio" value="3" name="check" id="checkbox3" onclick="changePayType(3)" >
                <label for="checkbox3"></label>
            </div>
        </li>
    </ul>
    <div class="pay-button-all" id="payBut"><a class="pay-button" href="#" onclick="paymentOrd();return false;">立即支付</a></div>
    <div class="pay-button-all" id="backBut" style="display:none"><a class="pay-button" href="home/index">重新选择</a></div>
  </div>
	<form id="submitForm" action="" method="post">
		<input type="hidden" id="orderCode" name="orderCode" value="${orderPayment.OrdCode}">
		<input type="hidden" id="money" name="money" value="0">
		<input type="hidden" id="PaymentType" name="PaymentType" value="1">
	</form>
<script src="js/jquery-1.10.2.min.js"></script>
<script type="text/javascript" src="js/jquery/swiper.js"></script>
<script type="text/javascript" src="js/artDialog/artDialog.source.js?skin=simple"></script>
<script type="text/javascript" src="js/artDialog/plugins/iframeTools.source.js"></script>
    <script type="text/javascript" src="http://res.wx.qq.com/open/js/jweixin-1.4.0.js"></script>
<script>
  //单纯分钟和秒倒计时
  var timer=null;
  var endTime=0;
  var allTime=${PayTime};
  var m=0;
  var s=0;
  if(Number(allTime)<0){
	$("#status").html("支付超时");
	$("#payBut").hide();
	$("#backBut").show();
  }else{
  	endTime=getTime()+allTime;
	timer=setInterval(countDown,1000);
  }
  
  function countDown(){
  	t=endTime-getTime();
  	m=Math.floor(t/60%60);
	m<10&&(m='0'+m);
	s=Math.floor(t%60);
	if(Number(s)<=0){
 		if(Number(m)<=0){
	 		clearInterval(timer);
	 		$("#status").html("支付超时");
	 		$("#payBut").hide();
	 		$("#backBut").show();
 		}else{
	 		s=59;
	 		m=(Number(m)-1);
	 		m<10&&(m='0'+m);
	 	}
	}else{
 		s<10&&(s='0'+s);
 	}
 	$("#time").html("00:"+m+":"+s);
  }
  function getTime(){
	return Number(Date.parse(new Date()))/1000;
  }
  
  function changePayType(type){
	  $("#PaymentType").val(type);
  }
  
  function paymentOrd(){

	  var payType=$("#PaymentType").val();
	  if(payType==0){
	  	art.dialog.tips('请选择支付方式');
	  }else if(payType==3){
  	    $.ajax({
	        url:"<%=basePath%>home/paymentOrd",
	        type:"post",
	        data:{OrdCode:$("#orderCode").val(),PaymentType:3,memKey:'${sessionScope.memKey}'},
	        success:function(data){
	            if(data=="success"){
	                art.dialog.tips('支付成功！');
                    window.location.replace("<%=basePath%>order/getAllOrderList?ordState=1000");
	            }else {
	                art.dialog.tips(data);
	            }
	        },
	        error:function(e){
	            art.dialog.tips('操作异常');
	        }
	    });
	  }else if(payType==1){
	  	  // onBridgeReady();
		  wxpay();
	  }else if(payType==2){
		  aplay();
	  }
  } 
  
  function onBridgeReady(){
	  $.ajax({
	        url:"<%=basePath%>home/paymentOrdWX",
	        type:"post",
	        data:{OrdCode:$("#orderCode").val(),memKey:'${sessionScope.memKey}'},
	        success:function(dataJson){
	        	data=eval('(' + dataJson + ')');
	        	if(data.code>0){
	        		var result=data.result;
	        		WeixinJSBridge.invoke(
   	  			      'getBrandWCPayRequest', {
   	  			         "appId":result.appId,     //公众号名称，由商户传入     
   	  			         "timeStamp":result.timeStamp,         //时间戳，自1970年以来的秒数     
   	  			         "nonceStr":result.nonceStr, //随机串     
   	  			         "package":"prepay_id="+result.prepay_id,
   	  			         "signType":result.signType,  //微信签名方式
   	  			         "paySign":result.sign //微信签名 
   	  			      },
   	  			      function(res){
   	  				      if(res.err_msg == "get_brand_wcpay_request:ok" ){
   	  				         // 使用以上方式判断前端返回,微信团队郑重提示：
   	  				         //res.err_msg将在用户支付成功后返回ok，但并不保证它绝对可靠。
   	  				    	 art.dialog.tips('支付成功！');
                              window.location.replace( "<%=basePath%>order/getAllOrderList?ordState=1000");
   	  				      } 
   	  			   }); 
	        	}else{
	        		art.dialog.tips('微信支付异常，请更换其他支付方式再试！');
	        	}
	        },
	        error:function(e){
	            art.dialog.tips('操作异常');
	        }
	    });
	}
  function wxpay(){
  	if (typeof WeixinJSBridge == "undefined"){
	   if( document.addEventListener ){
	       document.addEventListener('WeixinJSBridgeReady', onBridgeReady, false);
	   }else if (document.attachEvent){
	       document.attachEvent('WeixinJSBridgeReady', onBridgeReady);
	       document.attachEvent('onWeixinJSBridgeReady', onBridgeReady);
	   }
	}else{
	   onBridgeReady();
	 } 
  }
  
  function aplay(){
  		$.ajax({
	        url:"<%=basePath%>home/paymentOrdAi",
	        type:"post",
	        data:{OrdCode:$("#orderCode").val(),memKey:'${sessionScope.memKey}'},
	        success:function(dataJson){
	        	data=eval('(' + dataJson + ')');
	        	if(data.code>0){
	        		var money=data.result;
	        		$("#money").val(money);
	        		$("#submitForm").attr("action","<%=basePath%>home/aiplay");
	        		$("#submitForm").submit();
	        	}else{
	        		art.dialog.tips('支付宝支付异常，请更换其他支付方式再试！');
	        	}
	        },
	        error:function(e){
	            art.dialog.tips('操作异常');
	        }
	    });
  }
  function gotoMember(memKey){
  		location.replace("member/memberCenter?memKey="+memKey);
  }
</script>

</body>
</html>
